Skip to main content

Divider How To's

How to's for the Divider guide.

How to Use Divider?​

How to Use Divider?​

The Divider component is a simple but effective tool used in form design to separate areas into logical blocks. By following the steps below, you can easily add and configure a Divider in your form.

1. Adding a Divider to the Form​

  1. Open the form design screen in Synergy IDE.
  2. Go to the Toolbox panel.
  3. Find the Divider component.
  4. Drag and drop it to the desired position on the form.

2. Configuring Divider Properties​

When you click the Divider component, the Property Viewer panel displays the following sections:

General​

  • Allows you to adjust the visual structure of the Divider.
  • Width, alignment, or spacing settings may be available (depending on theme and project).

Events​

(Generally, Divider does not use events, but some custom themes may support them.)

3. Tips for Effective Usage​

  • Use it to separate content sections in long forms.
  • Place it between a Header and its content block to create visual structure.
  • Helps users navigate complex forms by providing visual “break points.”

Example Usage Scenario​

In an employee information form:

  • Personal Information
    Divider
  • Contact Information
    Divider
  • Address Details

This layout improves the readability of the form.

What Is Divider?​

What Is Divider?​

A Divider is a separator component used to visually group and distinguish different areas within a form, making the layout more understandable and improving the user experience.

It is typically used to create boundaries between two sections, such as between a header and its content, or among different subject areas.
When a form becomes visually crowded or complex, the Divider makes content blocks easier to read and organizes the structure more effectively.

Features​

  • Divides form content into visual sections.
  • Simplifies page layout and improves readability.
  • Can be added using drag-and-drop without writing any code.
  • Creates a clearly visible line or spacing between content blocks.

Usage Areas​

  • Separating content under section headers
  • Splitting long forms into meaningful parts
  • Reducing visual clutter in the form
  • Creating boundaries between grouped content

How to Use Client Enabled?​

What is Client Enabled?​

Client Enabled is a property that defines whether a form control is active (enabled) on the client side when the form is first loaded.
If it is set to True, the control is immediately usable by the user.
If it is set to False, the control is disabled and cannot be interacted with until a specific condition or rule activates it.

This property is especially useful for controlling the user’s interaction flow and applying dynamic behaviors using the Rule Manager.

What Does It Do?​

The property allows developers to:

  • Control when a form control becomes interactive.
  • Prevent users from entering or changing data until prerequisites are met.
  • Dynamically enable or disable controls based on user input or logic.

Example Scenario — Conditional Activation​

Scenario:
A form contains a checkbox called “I Accept Terms” and a text field called “Signature.”
The goal is to make the “Signature” field inactive until the user checks “I Accept Terms.”

Steps to Implement:​

  1. Select the “Signature” field in the form editor.

  2. In the Properties panel, find the Client Enabled field.

  3. Set the value to False — the field will now be disabled by default when the form loads.

  4. Open the Rule Manager.

  5. Add a new rule:

    Condition:

Action:

  1. Save and publish the form.

Result:​

  • When the form loads, the “Signature” field is disabled.
  • Once the user checks “I Accept Terms,” the field automatically becomes active and editable.

Behavior Summary​

Property StateDescription
TrueThe control is active and ready for user interaction when the form loads.
FalseThe control is disabled at load time and can be enabled dynamically via rules or code.

Notes & Best Practices​

  • Use the Client Enabled property to manage client-side interactivity without requiring server actions.
  • Combine it with Rule Manager to define when and how controls become active.
  • Remember: if server enablement is disabled, the client cannot enable the control even if Client Enabled is set to True.
  • By default, this property is set to True (active).

Summary​

Client Enabled improves form usability by letting developers control when and how users interact with form controls.
It is essential for creating responsive, condition-based form experiences where user actions dynamically change the form’s state.